<template>

    <h2>修改门店信息</h2>
    <table border="1">
        <tr>
            <td>门店名称</td>
            <td>
                <input type="text" v-model="info.ShopName">
            </td>
        </tr>
        <tr>
            <td>门店状态</td>
            <td>
                <input type="radio" :value="true" v-model="info.ShopState">启用
                <input type="radio" :value="false" v-model="info.ShopState">禁用
            </td>
        </tr>
        <tr>
            <td>省份</td>
            <td>
               <select v-model="info.Address" >
                <option value="北京顺义">北京顺义</option>
                <option value="湖南横店">湖南横店</option>
                <option value="上海">上海</option>
               </select>
            </td>
        </tr>
        <tr>
            <td>小程序预约</td>
            <td>
                <input type="radio" :value="true" v-model="info.YuYUe">开启
                <input type="radio" :value="false" v-model="info.YuYUe">关闭
            </td>
        </tr>
        <tr>
            <td>门店图片</td>
            <td>
                <input type="file" @change="UpLoad">
                <img style="width: 60px; height: 80px;" :src="info.ShopImg">
            </td>
        </tr>
        <tr>
            <td>星级</td>
            <td>
              <select v-model="info.XingJi">
                <option :value="1">★</option>
                <option :value="2">★★</option>
                <option :value="3">★★★</option>
                <option :value="4">★★★★</option>
              </select>
            </td>
        </tr>
       
       
        <tr>
            <td></td>
            <td>
                <input type="button" value="修改" @click="SaveData">
            </td>
        </tr>
    </table>


</template>
<script setup lang="ts">
import axios, { Axios } from 'axios';
import { onMounted,ref } from 'vue';
import { useRouter ,useRoute} from 'vue-router';



const route=useRoute();
const router=useRouter();

onMounted(()=>{
    LoadData();
})
//反填
const LoadData=()=>{
axios.get('https://localhost:7030/api/Shop/GetModel',

{
    params:{
        ShopId:route.params.id
    }
}

)
.then(res=>{
    info.value=res.data
})


}

const info=ref({

ShopName:"",
ShopState:true,
Address:"",
YuYUe:true,
ShopImg:"",
XingJi:"",



})

//上传文件
const UpLoad=(e:any)=>{

var file=e.target.files[0];
    var fd=new FormData();
    fd.append("img",file);

    axios.post('https://localhost:7030/api/Files/UpLoadFile',fd)
    .then(res=>{

        info.value.ShopImg=res.data
    })





}





const SaveData=()=>{

console.log(info.value);

if(info.value.ShopName==""){
    alert("不能为空");
    return;
}

axios.put('https://localhost:7030/api/Shop/UpdateShop',info.value)
.then(res=>{
    console.log(res.data);
     if(res.data>0){
        alert("修改成功");
        router.push("/ShowShop")
    }
    else{
        alert("修改失败");
    }
})


}



</script>